<template>
	<div class="view">
		<div class="item_title" style="font-size: 16px;color: #232842;margin-bottom: 20px;">后台配置</div>
		<el-form label-position="left" v-model="form" label-width="120px" label-align="center">
			<el-form-item label="每日同一手机号允许消耗短信条数:">
				<el-input style="width: 320px;" v-model="form.msmNumPhone"></el-input>
			</el-form-item>
			<el-form-item label="每日同一ip允许消耗短信条数:">
				<el-input style="width: 320px;" v-model="form.msmNumIp"></el-input>
			</el-form-item>
		</el-form>
		<div class="item_btn" style="margin-top: 20px;">
			<el-button type="primary" size="medium" @click="save" :disabled="isAdd">保存并发布</el-button>
		</div>
	</div>
</template>

<script>
import CropperImage from "../../../components/CropperImage.vue";
import FileUpload from "@/components/FileUpload.vue"
export default {
	components: {
		CropperImage,FileUpload
	},
	data() {
		return {
			form: {
				msmNumPhone:"",
				msmNumIp:"",
			},

			dialogImageUrl: '',
			dialogVisible: false,
			disabled: false,

			formValidate: {
				mainImage: '',
			},
			ruleValidate: {
				mainImage: [{
					required: true,
					message: '请上传图片',
					trigger: 'blur'
				}],
			},
			//裁切图片参数
			cropperModel: false,
			cropperName: '',
			imgName: '',
			imgVisible: false,
			mode: [120, 120],

			p_index: "",

			mealList: this.$root.mealList,

			isAdd: false,
		}
	},
	computed: {
	},
	methods: {

		// 获取初始数据
		data_init() {
			let that = this
			that.$http({
				'method': 'get',
				'url': this.$api.config
			}).then(res => {
				if (res.data.code == 20000) {
					const data = res.data.data.usual
					this.form.msmNumPhone = data.msmNumPhone
					this.form.msmNumIp = data.msmNumIp
				}
			})
		},

		// 保存数据
		save() {
			let dataDict = {
				...this.form,
			}
			console.log(dataDict)
			this.$http({
				'method': 'post',
				'url': this.$api.configUpdate,
				data: dataDict,
			}).then(res => {
				if (res.data.code == 20000) {
					this.$message({
						message: res.data.message,
						type: 'success'
					});

					this.data_init()
				} else {
					this.$message.error(res.data.message)
				}
				this.isAdd = false
			})
		},
	},
	created() {
		let that = this
		that.data_init()
		setTimeout(function () {
			that.mealList = that.$root.mealList
		}, 300)

		this.$emit('toNum', 2)

	}
}
</script>

<style scoped>
>>>.el-form-item__label {
	text-align: center!important;
}

>>>.el-input__inner {
	height: 36px;
	line-height: 36px;
}

>>>.el-form-item {
	margin-bottom: 20px;
}

.item_box {
	display: flex;
	flex-flow: wrap;
}
.item_box .item{
}
.item .item-title{
	font-size: 13px;
	color: #666;
	padding-left: 10px;
	box-sizing: border-box;
}

>>>.el-upload {
	width: 120px;
	height: 120px;
}

>>>.el-upload-list__item {
	width: 120px;
	height: 120px;
}

.item {
	margin-right: 20px;
}

.img_box {
	width: 120px;
	height: 120px;
	position: relative;
	overflow: hidden;
}

.img_box img {
	width: 120px;
	height: 120px;
	border-radius: 6px;
}

.img_tip {
	width: 120px;
	height: 120px;
	position: absolute;
	left: 0;
	top: 0;
	background-color: rgba(0, 0, 0, 0.3);
	display: flex;
	align-items: center;
	justify-content: space-around;
	opacity: 0;
	transition: .2s linear all;
}

.img_box:hover .img_tip {
	opacity: 1;
}

.img_tip i {
	color: #fff;
	cursor: pointer;
}

.img_tip i:hover {
	color: #0076FF;
}

.img_title {
	width: 100%;
	text-align: center;
	padding-top: 10px;
}

.img_box {
	margin-top: 10px;
}

.item-view {
	display: flex;
}

.item_title {
	margin-bottom: 10px;
}
</style>
